<div class="cq-menu--default_comp">
  <div class="pc">
    <div class="title-box">
      <span>菜单列表</span>
    </div>
    <div class="cq-menu cq-menu--vertical cq-menu--default">
      <ul class="cq-menu--list">
        <li class="cq-menu--item">
          <a class="cq-menu--container" href="javascript:void(0);">
            <div class="cq-menu--label">
              <i class="cq-icon iconfont icon-shouyeshouye"></i>
              <span class="cq-menu--title">首页</span>
            </div>
          </a>
        </li>
        <li class="cq-menu--item">
          <div class="cq-menu--container cq-accordion">
            <div class="cq-menu--label cq-accordion--lable is-alone">
              <i class="cq-icon iconfont icon-st-github"></i>
              <span class="cq-menu--title">仓库</span>
            </div>
            <!-- 二级导航 -->
            <div class="cq-menu--children is-level-2 cq-accordion--content">
              <ul class="cq-menu--list">
                <li class="cq-menu--item">
                  <a class="cq-menu--container" href="javascript:void(0);">
                    <div class="cq-menu--label">
                      <span class="cq-menu--title">二级</span>
                    </div>
                    <!-- 三级导航 -->
                    <div class="cq-menu--children is-level-3">
                      <ul class="cq-menu--list">
                        <li class="cq-menu--item">
                          <a class="cq-menu--container" href="javascript:void(0);">
                            <div class="cq-menu--label">
                              <span class="cq-menu--title">三级</span>
                            </div>
                          </a>
                        </li>
                        <li class="cq-menu--item">
                          <a class="cq-menu--container" href="javascript:void(0);">
                            <div class="cq-menu--label">
                              <span class="cq-menu--title">三级</span>
                            </div>
                            <div class="cq-menu--children"></div>
                          </a>
                        </li>
                        <li class="cq-menu--item">
                          <a class="cq-menu--container" href="javascript:void(0);">
                            <div class="cq-menu--label">
                              <span class="cq-menu--title">三级</span>
                            </div>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </a>
                </li>
                <li class="cq-menu--item">
                  <a class="cq-menu--container" href="javascript:void(0);">
                    <div class="cq-menu--label">
                      <span class="cq-menu--title">二级</span>
                    </div>
                  </a>
                </li>
                <li class="cq-menu--item">
                  <a class="cq-menu--container" href="javascript:void(0);">
                    <div class="cq-menu--label">
                      <span class="cq-menu--title">二级</span>
                    </div>
                  </a>
                </li>
              </ul>
            </div>
          </div>
        </li>
        <li class="cq-menu--item">
          <a class="cq-menu--container" href="javascript:void(0);">
            <div class="cq-menu--label">
              <i class="cq-icon iconfont icon-youqinglianjie"></i>
              <span class="cq-menu--title">友链</span>
            </div>
          </a>
        </li>
        <li class="cq-menu--item">
          <a class="cq-menu--container" href="javascript:void(0);">
            <div class="cq-menu--label">
              <i class="cq-icon iconfont icon-xiangce-copy"></i>
              <span class="cq-menu--title">相册</span>
            </div>
          </a>
        </li>
        <li class="cq-menu--item">
          <a class="cq-menu--container" href="javascript:void(0);">
            <div class="cq-menu--label">
              <i class="cq-icon iconfont icon-biji"></i>
              <span class="cq-menu--title">日志</span>
            </div>
          </a>
        </li>
      </ul>
    </div>
  </div>
  <div class="mobile">
    <button class="cq-btn cq-btn--s1n1" id="menu-btn--mobile">
      <span class="cq-btn--line"></span>
    </button>
    <div class="cq-popup cq-popup--center" id="menu-popup--mobile">
      <div class="cq-popup--content">
        <!-- 关闭按钮 -->
        <button class="cq-btn cq-btn--text" id="menu-btn--mobile_close">
          <div class="cq-btn--line"></div>
        </button>
        <!-- 手机端导航 -->
        <div class="cq-menu cq-menu--vertical cq-menu--default">
          <ul class="cq-menu--list">
            <li class="cq-menu--item">
              <a class="cq-menu--container" href="javascript:void(0);">
                <div class="cq-menu--label">
                  <i class="cq-icon iconfont icon-shouyeshouye"></i>
                  <span class="cq-menu--title">首页</span>
                </div>
              </a>
            </li>
            <li class="cq-menu--item">
              <div class="cq-menu--container cq-accordion">
                <div class="cq-menu--label cq-accordion--lable is-alone">
                  <i class="cq-icon iconfont icon-st-github"></i>
                  <span class="cq-menu--title">仓库</span>
                </div>
                <!-- 二级导航 -->
                <div class="cq-menu--children is-level-2 cq-accordion--content">
                  <ul class="cq-menu--list">
                    <li class="cq-menu--item">
                      <a class="cq-menu--container" href="javascript:void(0);">
                        <div class="cq-menu--label">
                          <span class="cq-menu--title">二级</span>
                        </div>
                        <!-- 三级导航 -->
                        <div class="cq-menu--children is-level-3">
                          <ul class="cq-menu--list">
                            <li class="cq-menu--item">
                              <a class="cq-menu--container" href="javascript:void(0);">
                                <div class="cq-menu--label">
                                  <span class="cq-menu--title">三级</span>
                                </div>
                              </a>
                            </li>
                            <li class="cq-menu--item">
                              <a class="cq-menu--container" href="javascript:void(0);">
                                <div class="cq-menu--label">
                                  <span class="cq-menu--title">三级</span>
                                </div>
                                <div class="cq-menu--children"></div>
                              </a>
                            </li>
                            <li class="cq-menu--item">
                              <a class="cq-menu--container" href="javascript:void(0);">
                                <div class="cq-menu--label">
                                  <span class="cq-menu--title">三级</span>
                                </div>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </a>
                    </li>
                    <li class="cq-menu--item">
                      <a class="cq-menu--container" href="javascript:void(0);">
                        <div class="cq-menu--label">
                          <span class="cq-menu--title">二级</span>
                        </div>
                      </a>
                    </li>
                    <li class="cq-menu--item">
                      <a class="cq-menu--container" href="javascript:void(0);">
                        <div class="cq-menu--label">
                          <span class="cq-menu--title">二级</span>
                        </div>
                      </a>
                    </li>
                  </ul>
                </div>
              </div>
            </li>
            <li class="cq-menu--item">
              <a class="cq-menu--container" href="javascript:void(0);">
                <div class="cq-menu--label">
                  <i class="cq-icon iconfont icon-youqinglianjie"></i>
                  <span class="cq-menu--title">友链</span>
                </div>
              </a>
            </li>
            <li class="cq-menu--item">
              <a class="cq-menu--container" href="javascript:void(0);">
                <div class="cq-menu--label">
                  <i class="cq-icon iconfont icon-xiangce-copy"></i>
                  <span class="cq-menu--title">相册</span>
                </div>
              </a>
            </li>
            <li class="cq-menu--item">
              <a class="cq-menu--container" href="javascript:void(0);">
                <div class="cq-menu--label">
                  <i class="cq-icon iconfont icon-biji"></i>
                  <span class="cq-menu--title">日志</span>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>